var oInput=document.getElementById("bir").getElementsByTagName("input");
var oFo=document.getElementById("tab");
var oUl=oFo.getElementsByTagName("ul");
for( var i=0;i<oInput.length;i++){

    oInput[i].index=i;

    oInput[i].onclick=function(){
        for( var j=0;j<oInput.length;j++){
            oInput[j].style.backgroundColor="#ffffff";
            oUl[j].style.display="none";
        }
        change(oUl[this.index],this.index)
     oUl[this.index].style.display="block";
     this.style.backgroundColor="#cccccc";
    }

    }

function change(obj,n) {
    var oLi = obj.getElementsByTagName("li");
    for (var j = 0; j < oLi.length; j++) {
        oLi[j].onmouseover = function () {
            this.style.fontSize = "15px";
        }
        oLi[j].onmouseout = function () {
            this.style.fontSize = "13px";
        }
        oLi[j].onclick = function () {
            for (var j = 0; j < oLi.length; j++) {
                oLi[j].getElementsByTagName("span")[0].style.color="#cccccc";
            }
            this.getElementsByTagName("span")[0].style.color="blue";
            oInput[n].value = this.getElementsByTagName("i")[0].innerHTML;
            oInput[n].style.backgroundColor = "#ffffff";
            oInput[n].style.color = "#000000"
            this.parentNode.style.display = "none";


        }
    }
}
